<template>
  <!-- 出险人信息 -->
  <div class="addident-page">
    <!-- <h3 v-show="title" class="title">{{title}}</h3> -->
    <!-- 有左右margin的放.body里面，跟表格100%宽度分开 -->
    <div class="body">
      <!-- 出险人信息 -->
      <div class="self-tab">{{$I18n.baseInfo}}</div>
      <el-form>
        <!-- 邮箱 -->
        <el-form-item :label="$I18n.email" :class="{'no-line': isEdit}" required>
          <el-input v-model="emailData.email"  :readonly="isEdit" ></el-input>
        </el-form-item>
        <!-- 密码 -->
        <el-form-item  :label="$I18n.password" :class="{'no-line': isEdit}" required>
          <el-input v-model="emailData.emailPassword" :readonly="isEdit"></el-input>
        </el-form-item>
        <!-- 辅助邮箱 -->
        <el-form-item  :label="$I18n.assistEmail" :class="{'no-line': isEdit}" required>
          <el-input v-model="emailData.assistEmail" :readonly="isEdit"></el-input>
        </el-form-item>
        <!-- 价格 -->
        <el-form-item  :label="$I18n.price" :class="{'no-line': isEdit}" required>
          <el-input v-model="emailData.price" :readonly="isEdit"></el-input>
        </el-form-item>
         <!-- 状态 -->
          <el-form-item :label="$I18n.emailStatus" required :class="{'no-line': isEdit}">
            <el-select v-model="emailData.emailStatus" :readonly="isEdit">
              <el-option v-for="item in statusList" :key="item.codeKey" :label="item.codeName" :value="item.codeKey"></el-option>
            </el-select>
          </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>

export default {
  // 父组件传过来的 title: 标题, noPolicy: 是否不显示保单,默认显示 ()
  props: ['title', 'emailData', 'isEdit'],
  data() {
    return {
      statusList: [
        {codeKey: 'NEW', codeName: '新开'},
        {codeKey: 'USEING', codeName: '使用中'},
        {codeKey: 'DISABLE', codeName: '废弃'}
      ]
    }
  },
  created() {
    this.$on('save', res => {
      window.emailData = this.emailData
    })
  },
  methods: {
    // 改变页码，重新加载表格数据
    loadTableList(page) {
      //  watch监听不到Object.assign，故用$set
      this.$set(this.tagsInfo, 'pageSize', page.pageSize)
      this.$set(this.tagsInfo, 'currentPage', page.currentPage)
    },
    // 开始搜索,table组件会监听tagsInfo,只需改变即可
    search(obj) {
      this.tagsInfo = obj
    }
  },
  watch: {
    isEdit(v) {
      console.log(v)
    }
  }
}
</script>

<style lang="stylus">
.addident-page
  .policy-info
    margin-top 30px
  .fa-external-link
    position absolute
    color #6a8ebf
    cursor pointer
    top 50%
    right -18px
    transform translateY(-50%)
    
  .policy-table
    margin-top 0 !important
  .el-table__body-wrapper
    overflow-x hiddens
  
  .search-input
    width 100%
  .pagination-page
    justify-content flex-end
    margin-top 5px
</style>